<template>
  <div>
    <div v-if="editable" class="crud-opts">
      <el-button
        v-loading="loading"
        class="filter-item"
        size="mini"
        type="danger"
        icon="el-icon-delete"
        @click="doDeleteItem">删除<IconHelp display-content="已领用的不能删除."/></el-button>
      <el-button
        v-loading="loading"
        class="filter-item"
        size="mini"
        type="warning"
        icon="el-icon-cpu"
        @click="doRunMrp">MRP运算</el-button>
      <el-checkbox v-model="bomCheckFlag" true-label="Y" false-label="N">
        所有BOM层<IconHelp display-content="勾选后系统将生成该生产物料所有的需求量"/>
      </el-checkbox>
    </div>
    <el-table
      :data="moDetails"
      size="mini"
      style="width: 100%"
      @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="50" />
      <el-table-column prop="itemCode" label="物料编号"/>
      <el-table-column label="物料名称" prop="itemName" width="200" show-overflow-tooltip/>
      <el-table-column label="单位" width="90">
        <template slot-scope="scope">
          <template v-for="item in dicts.item_unit">
            <span v-if="scope.row.unit && scope.row.unit === item.dictCode" :key="item.id" >{{ item.dictName }}</span>
          </template>
        </template>
      </el-table-column>
      <el-table-column label="MRP计算量" width="120" prop="mrpReqQty">
        <template slot-scope="scope">
          <el-input-number v-model.number="scope.row.mrpReqQty" :disabled="true" :controls="false" :precision="2" size="mini" style="width: 100%" />
        </template>
      </el-table-column>
      <el-table-column label="领用数" width="120" prop="reqQty">
        <template slot-scope="scope">
          <el-input-number v-model.number="scope.row.reqQty" :disabled="!editable" :controls="false" :precision="2" :min="scope.row.useQty" size="mini" style="width: 100%" />
        </template>
      </el-table-column>
      <el-table-column label="已领用数" width="120" prop="useQty" />
      <el-table-column label="规格" prop="itemSpec" show-overflow-tooltip />
      <el-table-column label="品牌" prop="itemBrand" show-overflow-tooltip />
      <el-table-column label="备注" show-overflow-tooltip>
        <template slot-scope="scope">
          <el-input v-model="scope.row.rmk" :disabled="!editable" size="mini" style="width: 100%"/>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import oemMo from '@/api/prod/OemMo'

export default {
  dictTypes: ['item_unit'],
  props: {
    moDetails: {
      type: Array,
      required: true
    },
    editable: {
      type: Boolean,
      default: false,
      required: false
    },
    supForm: {
      type: Object,
      default: null,
      required: true
    }
  },
  data() {
    return {
      loading: false,
      bomCheckFlag: 'N',
      selectedDetailRows: [],
      style: 'width: 150px'
    }
  },
  methods: {
    getMaxDetailNum() {
      let detailNum = 0
      this.moDetails.forEach(tmprow => {
        if (tmprow.num > detailNum) {
          detailNum = tmprow.num
        }
      })
      return detailNum
    },
    handleSelectionChange(val) {
      this.selectedDetailRows = val
    },
    doDeleteItem() {
      let tmpDetails = JSON.parse(JSON.stringify(this.moDetails))
      this.selectedDetailRows.forEach(tmprow => {
        const useQty = tmprow.useQty || 0
        if (useQty === 0) {
          tmpDetails = tmpDetails.filter(vo => vo.num !== tmprow.num)
        }
      })
      this.$emit('setDetails', tmpDetails)
    },
    doCopyItem() {
      const tmpDetails = JSON.parse(JSON.stringify(this.moDetails))
      let detailNum = this.getMaxDetailNum()
      this.selectedDetailRows.forEach(tmprow => {
        const addRow = JSON.parse(JSON.stringify(tmprow))
        detailNum++
        addRow.id = null
        addRow.detailLotNo = null
        addRow.num = detailNum
        tmpDetails.push(addRow)
      })
      this.$emit('setDetails', tmpDetails)
    },
    doRunMrp() {
      const _this = this
      const busMainData = _this.supForm.form.busMainData
      if (!busMainData.bomCode) {
        this.$message({
          message: '请选择BOM',
          type: 'warning'
        })
        return
      }
      if (!busMainData.itemId) {
        this.$message({
          message: '请选择生产物料',
          type: 'warning'
        })
        return
      }
      _this.loading = true
      this.$confirm('确认要运行MRP计算,会覆盖明细?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        center: true
      }).then(() => {
        busMainData.attribute1 = this.bomCheckFlag
        oemMo.postRequestByName('doRunMrp', { paramBean: busMainData, moDetails: this.moDetails }).then(res => {
          _this.loading = false
          _this.$emit('setDetails', res.data)
        }).catch(err => {
          _this.loading = false
          console.log(err)
        })
      }).catch(() => {
        _this.loading = false
      })
    }
  }
}
</script>
